<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>PostNotice - Group4 UniHub</title>
    <link rel="icon" href="favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="../styles/main.css">
    <link rel="stylesheet" href="../styles/components.css">
    <link rel="stylesheet" href="../styles/noticeboard.css">
</head>
<body>
    <div id="header">
        <app-header page-title="Campus Noticeboard"></app-header>
    </div>
    
    <div class="main-container">
        <div id="sidebar"></div>
        
        <div class="content">
            <div class="post-form">
                <input type="text" class="post-title" placeholder="Enter title">
                <textarea class="post-content" placeholder="Content"></textarea>
                <div class="post-options">
                    <select class="category-select">
                        <option value="">Select Category</option>
                        <option value="news">News</option>
                        <option value="activity">Activities</option>
                        <option value="notice">Notices</option>
                    </select>
                    <div class="file-upload">
                        <input type="file" id="fileInput" class="file-input" accept="image/*,video/*" multiple>
                        <label for="fileInput" class="file-label">Choose Images or Videos</label>
                    </div>
                </div>
                <div class="selected-files" id="selectedFiles">
                    <!-- Selected files will be displayed here -->
                </div>
                <div class="post-actions">
                    <button class="action-btn post-btn">Post</button>
                    <button class="action-btn cancel-btn">Back</button>
                </div>
            </div>
        </div>
    </div>

    <script src="../components/header.js"></script>
    <script type="module" src="../components/sidebar.js"></script>
    <script type="module" src="../scripts/post-notice.js"></script>
</body>
</html> 